<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>My Site</title>
<link rel="icon" href="/common/img/favicon.png" type="image/x-icon" />
<link rel="shortcut icon" href="/common/img/favicon.ico" type="image/ico" />
<link rel="stylesheet" type="text/css" href="/common/css/cmn_layout.css" media="all" />
<link rel="stylesheet" type="text/css" href="/common/css/cmn_style.css" media="all">
<script src="/common/js/jquery.js"></script>
<script>
jQuery(document).ready(function($) {
	$('.spinnerwrapper').show('fast').delay(3000).hide('slow');
	$('.hello').hide('fast').delay(3000).fadeIn('slow');
})
</script>
</head>

<body>
<div class="wrapper">
	<div id="sidebar">
	<img src="/common/img/logo.png" alt="sakura" width="180" height="180" id="logo"/>
	<p class="fzLLL fwB">Welcome to My Site</p>
	<div class="social">
		<a href=""><img src="/common/img/fb.png" alt="FB" width="50" height="50" id="fb"/></a>
		<a href=""><img src="/common/img/gplus.png" alt="Google+" width="50" height="50" id="gplus"/></a>
		<a href=""><img src="/common/img/twt.png" alt="Twitter" width="50" height="50" id="twt"/></a>
	</div>
	<!-- / #sidebar --></div>
    <div class="main">
    	<div class="spinnerwrapper">
    		<div class="spinner circles">
    		    <div></div>
    		    <div></div>
    		    <div></div>
    		    <div></div>
    		    <div></div>
    		    <div></div>
    		    <div></div>
    		    <div></div>
    		</div>
    	</div>
        <p class="hello">Hello :)</p>
    </div>
<!-- / .wrapper --></div>
</body>
</html>
